<template>
    <div>
        <el-row style="margin-top: 30px;">
            <el-col class="title" :span="10" :offset="4"><i class="el-icon-monitor"></i>医院就诊综合系统-登录页面
            </el-col>
        </el-row>
        <el-row style="margin-top: 30px">
            <el-col style="width: 1120px;height: 465px;border: 1px solid black" :offset="4">
                <el-col :span="12">
                    <img :src="url" style="width: 755px;height:463px">
                </el-col>
                <el-col :span="12">
                    <el-row>
                        <el-col :offset="10" :span="5">
                            <h3>用户登录</h3>
                            <!--<h3>{{username}}</h3>-->
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 30px">
                        <el-col :span="12" :offset="10">
                            <el-input
                                placeholder="请输入账号"
                                prefix-icon="el-icon-user"
                                show-word-limit
                                v-model="account">
                            </el-input>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 30px">
                        <el-col :span="12" :offset="10">
                            <el-input
                                placeholder="请输入密码"
                                prefix-icon="el-icon-lock"
                                show-word-limit
                                show-password
                                v-model="password">
                            </el-input>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 15px">
                        <router-link to="/forget">
                            <el-col class="function" :span="5" :offset="19" style="color: blue;font-size: 15px;">忘记密码？
                            </el-col>
                        </router-link>

                    </el-row>
                    <el-row>
                        <el-col :span="7" :offset="10" style="margin-top: 30px">
                            <router-link to="2" style="text-decoration: none;color: white">
                                <el-button type="danger">
                                    立即注册账号
                                </el-button>
                            </router-link>
                        </el-col>
                        <el-col :span="7" style="margin-top: 30px">
                            <el-button class="login" type="primary" style="width: 100px" @click="checkUserLogin">点击登录
                            </el-button>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col style="margin-top: 5px;margin-right:10px;height: 100px" :span="15" :offset="9">
                            <el-card shadow="hover" v-if="this.$store.state.accountShowOrNot">
                                <el-row :offset="5">
                                    尊敬的用户：<span style="color: blue">{{
                                        this.$store.state.currentUser.username
                                    }}</span>
                                </el-row>
                                <el-row :offset="5" style="margin-top: 20px">
                                    您的身份为：<span style="color: blue" v-if="this.$store.state.currentUser.roleflag==3">患者</span>
                                    <span style="color: blue" v-if="this.$store.state.currentUser.roleflag==2">医生</span>
                                    <span style="color: blue"
                                          v-if="this.$store.state.currentUser.roleflag==1">管理员</span>
                                </el-row>
                                <el-row style="margin-top: 20px">
                                    您的默认账号为：<span style="color: blue">{{this.$store.state.currentUser.account }}</span>
                                </el-row>
                                <el-row style="margin-top: 20px">
                                    账号注册时间:<span style="color: blue">{{
                                        this.$store.state.currentUser.datetime|dateFormat
                                    }}</span>
                                </el-row>
                            </el-card>
                        </el-col>
                    </el-row>
                </el-col>
            </el-col>
        </el-row>
    </div>
</template>

<script>

import axios from "axios";

export default {
    name: "AppLogin",
    data() {
        return {
            username: "123",
            account: "",
            password: "",
            time: "",
            url: require('../assets/images/img.png'),
            data: "",
        }
    },
    mounted() {

    },
    methods: {
        checkUserLogin() {
            if (this.username === "" || this.password === "") {
                this.$message({
                    message: "请输入用户名或密码",
                    type: "error",
                    duration: 2000
                })
                return;
            }
            const that = this;
            axios.post("http://localhost:8848/user/checkUserLogin", {
                account: that.account,
                password: that.password,
            }).then(function (response) {
                    console.log(response);
                    that.loginFeedBack({response});
                }
            );
        },
        loginFeedBack(data) {
            console.log(data.response.data.code)
            switch (data.response.data.code) {
                case 0: {
                    this.$store.state.currentUser=data.response.data.data;
                    this.$notify({
                        title: "登录成功,欢迎用户"+data.response.data.data.username,
                        type: "success",
                        duration: 2000
                    })
                    console.log("当前对象信息："+this.$store.state.currentUser)
                    if (this.$store.state.currentUser.roleflag === 3) {
                        this.$router.push({
                            path: "/3-3",
                        });
                    }
                    if (this.$store.state.currentUser.roleflag === 2) {
                        this.$router.push({
                            path: "/3-3",
                        });
                    }
                    if (this.$store.state.currentUser.roleflag === 1) {
                        this.$router.push({
                            path: "/3-1",
                        });
                    }
                    break;
                }
                case -1: {
                    this.$message({
                        message: "账号或密码错误，请重试",
                        type: "error",
                        duration: 2000
                    })
                    break;
                }
            }
        },
    },

}
</script>

<style scoped>
.title {
    font: normal 24px/45px "microsoft YaHei";
    color: #1069a4;
    padding: 0;
}

.function:hover {
    cursor: pointer;
}
</style>
